import 'package:flutter/cupertino.dart';
import 'package:flutter/services.dart';
import 'package:flutterlib/common/constants/constants.dart';
import 'package:flutterlib/common/localization/default_localizations.dart';
import 'package:flutterlib/common/style/meterial_design_icons.dart';
import 'package:flutterlib/model/post/post_bean.dart';
import 'package:flutterlib/common/utils/utils.dart';
import 'package:flutterlib/pages/interest/list/interest_search_list_widget_page.dart';
import 'package:flutterlib/pages/post/search/post_list_search_widget_page.dart';
import 'package:flutterlib/pages/post/viewmodel/post_store.dart';
import 'package:flutterlib/widgets/quhui_tabbar_widget.dart';
import 'package:flutterlib/widgets/round_underline_tabindicator.dart';

class Page extends StatefulWidget{
  final String content;

  const Page({Key key, this.content}) : super(key: key);

  @override
  State<StatefulWidget> createState() {
    return PageState();
  }

}
class PageState extends State<Page>
  with AutomaticKeepAliveClientMixin {
  PostStore store = new PostStore();
  final FocusNode _focusNode = FocusNode();
  TextEditingController _controller = TextEditingController();

  List<PostBean> postList;

  bool _loaded = false,
  _canClear = true,
  _autoFocus = true;

  getSearchAppBar(){
    return PreferredSize(
        preferredSize: const Size.fromHeight(kAppBarHeight),
        child: Padding(
          padding: const EdgeInsets.symmetric(vertical: 15.0),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.start,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: <Widget>[
              MyBackButton(),
              Expanded(child: searchTextField(context)),
              searchButton,
            ],
          ),
        ),
      );
  }




  Widget get searchButton => IconButton(
    icon: Icon(Icons.search, size: 30.w ,color: QuhuiColors.primaryDarkValue,),
    onPressed: () {
      store.updateSearchWord(_controller.text);
    },
  );
  @override
  void dispose() {
    _controller?.removeListener(canClearListener);
    _controller?.dispose();
    _focusNode
      ..unfocus()
      ..dispose();
    super.dispose();
  }

  @override
  void didChangeDependencies() {
      _autoFocus = false;
      _controller?.removeListener(canClearListener);
      _controller = TextEditingController(text: widget.content);
      store.updateSearchWord(widget.content);
    super.didChangeDependencies();
  }

  @override
  bool get wantKeepAlive => true;

  void canClearListener() {
    _canClear = _controller.text.isNotEmpty;
    if (mounted) {
      setState(() {});
    }
  }

  Widget searchTextField(BuildContext context, {String content}) {
    if (content != null) {
      _controller = TextEditingController(text: content);
    }
    return Container(
      height: kAppBarHeight.h / 3,
      padding: EdgeInsets.only(
        left: 16.w,
      ),
      decoration: BoxDecoration(
        color: Theme.of(context).canvasColor,
      ),
      child: Row(
        children: <Widget>[
          Expanded(
            child: TextField(
              autofocus: _autoFocus && !_loaded,
              controller: _controller,
              cursorColor: currentThemeColor,
              decoration: const InputDecoration(
                border: InputBorder.none,
                contentPadding: EdgeInsets.zero,
                hintText: '输入要搜索的内容',
                hintStyle: TextStyle(
                  color: Colors.grey,
                  fontStyle: FontStyle.italic,
                  textBaseline: TextBaseline.alphabetic,
                ),
                isDense: true,
              ),
              focusNode: _focusNode,
              keyboardType: TextInputType.text,
              style: TextStyle(
                fontSize: 15.sp,
                fontWeight: FontWeight.normal,
                textBaseline: TextBaseline.alphabetic,
              ),
              textInputAction: TextInputAction.search,
              onSubmitted: (String text) {
                store.updateSearchWord(text);
              },
            ),
          ),
          if (_canClear) clearButton,
        ],
      ),
    );
  }

  Widget get clearButton => GestureDetector(
    behavior: HitTestBehavior.opaque,
    onTap: () {
      _controller.clear();
      _focusNode.requestFocus();
    },
    child: Padding(
      padding: EdgeInsets.symmetric(horizontal: 16.w),
      child: Icon(
        Icons.clear,
        size: 24.w,
        color: Theme.of(context).iconTheme.color,
      ),
    ),
  );

  getTabItem(String title, int badge) {
    return Stack(
      children: <Widget>[
        Padding(
          padding: const EdgeInsets.fromLTRB(10, 5, 10, 5),
          child: Text(
            title,
            style: QuhuiConstant.smallText,
          ),
        ),
        Positioned(
          child: badge > 0
              ? Text(badge.toString(),
              style:
              QuhuiConstant.minMinSubGray6Text)
              : Text(""),
          right: 0.0,
          top: 5.0,
        ),
      ],
    );
  }

  renderItem(String item, int i, int length) {
    return VgTab(
      child: getTabItem(item, length),
    );
  }
  @override
  Widget build(BuildContext context) {

    return Observer(
      builder: (_) {

        var searchWord = store.searchWord;
        ValueKey key = ValueKey(searchWord);
        List<Widget> tabPageView = new List();
        List<Widget> tabViews = new List();
        tabPageView.add(new PostSearchListWidgetPage(key: key, searchWord: searchWord));
        tabViews.add(renderItem("文章", 1, 0));
        tabPageView.add(new InterestSearchListWidgetPage(key: key, searchWord: searchWord));
        tabViews
            .add(renderItem("兴趣", 2, 0));
        return new QuhuiTabBarWidget(
          type: TabType.top,
          tabItems: tabViews,
          tabBarType: 1,
          resizeToAvoidBottomPadding: false,
          tabViews: tabPageView,
          backgroundColor: QuhuiColors.mainBackgroundColor,
          indicatorColor: QuhuiColors.mainThemeColor,
          title: getSearchAppBar(),
          onPageChanged: (index) {},
        );
      }

    );
    }


}